<!DOCTYPE html>
<html>
  <head>
    <title>报名</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
      <link rel="stylesheet" href="${s.base}/mobile/lib/Mdate/needcss/Mdate.css">
      <link rel="stylesheet" href="${s.base}/mobile/css/base.css">
      <link rel="stylesheet" href="${s.base}/mobile/css/component.css">
      <link rel="stylesheet" href="${s.base}/mobile/css/weui.min.css">
      <link rel="stylesheet" href="${s.base}/mobile/css/jquery-weui.css">
      <style type="text/css">
          *, *:before, *:after{
              webkit-box-sizing:content-box;
              box-sizing:content-box;
          }
      </style>
  </head>
  <body>
  <div id="showContent">
      <#if status =='0'||status =='3'>
          <#if status =='3'>
              <div style="width: 90%; height: auto;line-height: 1.2rem;background: #fff; padding: 0.2rem 5%; margin-bottom: 0.002rem;">
                  审核不通过，原因是${webOrder.checkRemark}
              </div>
          </#if>
          <div class="xyg-comp-list-select">
              <input type="hidden" id="id" value="${webOrder.id}" />
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      <span style="color: #FF0000;">*</span>报名活动
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text" value="${webSignUp.title}" disabled />
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      <span style="color: #FF0000;">*</span>姓名
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text" id="name" value="${webOrder.name}" max="12" placeholder="请先填写姓名" />
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      <span style="color: #FF0000;">*</span>出生日期
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text" id="brithday" value="${(webOrder.brithday?string('yyyy-MM-dd'))!''}" max="12" placeholder="请选择出生日期" />
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      <span style="color: #FF0000;">*</span>性别
                  </div>
                  <input type="hidden" id="sex" value="${webOrder.sex}"/>
                  <div class="xyg-comp-list-select-item-icon"  id="sexSelect">
                      <span>
                          <#if webOrder.sex??>
                              <#list sexDictList as sexDict>
                              <#if sexDict.value == webOrder.sex>
                                  ${sexDict.name}
                              </#if>
                          </#list>
                              <#else>
                                  请选择性别
                          </#if>

                      </span>
                      <svg class="icon" aria-hidden="true">
                          <use xlink:href="#icon-xiangyou"></use>
                      </svg>
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      <span style="color: #FF0000;">*</span>民族
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  id="nation" value="${webOrder.nation}" maxlength="20" placeholder="请先填写民族" />
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      <span style="color: #FF0000;">*</span>联系电话
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  id="phone" value="${webOrder.phone}" maxlength="12" placeholder="请先填写联系电话" />
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      <span style="color: #FF0000;">*</span>工作地址
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  id="workAddress" value="${webOrder.workAddress}" maxlength="100" placeholder="请先填写工作地址" />
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      <span style="color: #FF0000;">*</span>家庭地址
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  id="homeAddress" value="${webOrder.homeAddress}" maxlength="100" placeholder="请先填写家庭地址" />
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      <span style="color: #FF0000;">*</span> 政治面貌
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  id="political" value="${webOrder.political}" maxlength="40" placeholder="请先填写政治面貌" />
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      <span style="color: #FF0000;">*</span>身份证号
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  id="idCard" value="${webOrder.idCard}" maxlength="40" placeholder="请先填写身份证号" />
                  </div>
              </div>
              <div class="xyg-comp-pic" style="margin-top: 0.5rem;">
                  <div class="xyg-comp-pic-title">
                      <span style="color: #FF0000;">*</span>上传身份证
                  </div>
                  <div class="xyg-comp-pic-title-left">
                      <img id="showPicture" src="${s.base}/mobile/images/show/idcard.png"/>
                      <input type="hidden"  id="idCardPicture" value="${webOrder.idCardPicture}"/>
                  </div>
                  <div class="xyg-comp-pic-title-right">
                      <div class="weui-uploader" style="width: 90%; padding: 0px 5%; height: 6rem;">
                          <div class="weui-uploader__bd">
                              <div class="weui-uploader__input-box"  style="width: 96%; height:6rem;">
                                  <input id="uploaderInput" name="file" onchange="ajaxFileUploads('uploaderInput','phone/idcard','idCardPicture','showPicture')" class="weui-uploader__input" type="file" accept="image/*" multiple="">
                              </div>
                          </div>
                      </div>
                  </div>
                  <div class="clearBoth"></div>
              </div>
              <div class="xyg-comp-pic" style="margin-top: 0.5rem;">
                  <div class="xyg-comp-pic-title">
                      <span style="color: #FF0000;">*</span>上传照片
                  </div>
                  <div class="xyg-comp-pic-title-left">
                      <img id="headImageShowPicture" style="width: 80%; margin: 0px 10%;" src="${s.base}/image/avatar_default.jpg"/>
                      <input type="hidden"  id="headImage" value="${webOrder.headImage}"/>
                  </div>
                  <div class="xyg-comp-pic-title-right">
                      <div class="weui-uploader" style="width: 80%; padding: 0px 10%; height: 6rem;">
                          <div class="weui-uploader__bd">
                              <div class="weui-uploader__input-box"  style="width: 96%; height:6rem;">
                                  <input id="headImageInput" name="file" onchange="ajaxFileUploads('headImageInput','phone/headImage','headImage','headImageShowPicture')" class="weui-uploader__input" type="file" accept="image/*" multiple="">
                              </div>
                          </div>
                      </div>
                  </div>
                  <div class="clearBoth"></div>
              </div>
              <div class="xyg-comp-list-select-item" style="margin-top: 0.5rem;">
                  <div style="float: left;font-size: 14px">用户承诺书：</div>
                  <div style="float: left; line-height: 2.2rem;"><input type="checkbox" id="checkSelect"/><a style="color: #d2d2d2;font-size: 14px"> 点击详情</a></div>
                  <div style="float: right; line-height: 2.2rem;color: #d2d2d2; font-size: 14px;">
                      &nbsp;同意请勾选，方可以提交
                  </div>
                  <div class="clearBoth"></div>


              </div>
          </div>
          <div class="xyg-bottom">
              <button type="button" id="submitBtn" class="weui-btn weui-btn_warn">立即报名</button>
          </div>
      </#if>
      <#if status =='1'||status =='2'>
          <!-- 审核状态:1、待审核，2、审核通过,3、审核未通过-->
          <div class="xyg-comp-list-select">
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      报名活动
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text" value="${webSignUp.title}" disabled />
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      姓名
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text" value="${webOrder.name}" disabled/>
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      出生日期
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text" value="${(webOrder.brithday?string('yyyy-MM-dd'))!''}" disabled/>
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      性别
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <#list sexDictList as sexDict>
                          <#if sexDict.value == webOrder.sex>
                              <input type="text" value="${sexDict.name}" disabled/>
                          </#if>
                      </#list>
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      民族
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  value="${webOrder.nation}" disabled/>
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      联系电话
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  value="${webOrder.phone}" disabled/>
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      工作地址
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text" value="${webOrder.workAddress}" disabled/>
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      家庭地址
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  value="${webOrder.homeAddress}" disabled/>
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      政治面貌
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  value="${webOrder.political}" disabled/>
                  </div>
              </div>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      身份证号
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text"  value="${webOrder.idCard}"disabled/>
                  </div>
              </div>


              <div class="xyg-comp-pic" style="margin-top: 0.5rem;">
                  <div class="xyg-comp-pic-title">
                      上传身份证
                  </div>
                  <div class="xyg-comp-pic-title-left">
                      <img  src="${webOrder.idCardPicture}"/>
                  </div>
                  <div class="clearBoth"></div>
              </div>
              <div class="xyg-comp-pic" style="margin-top: 0.5rem;">
                  <div class="xyg-comp-pic-title">
                      上传照片
                  </div>
                  <div class="xyg-comp-pic-title-left">
                      <img  src="${webOrder.headImage}"/>
                  </div>
                  <div class="clearBoth"></div>
              </div>
              <div class="xyg-comp-list-select-item" style="margin-top: 0.5rem;">
                  <div class="xyg-comp-list-select-item-title">
                      提交时间
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text" value="${webOrder.updateTime?string('yyyy-MM-dd HH:mm:ss')}" disabled/>
                  </div>
              </div>
              <#if status=='2'>
              <div class="xyg-comp-list-select-item">
                  <div class="xyg-comp-list-select-item-title">
                      审核信息
                  </div>
                  <div class="xyg-comp-list-select-item-content">
                      <input type="text" value="${webOrder.checkRemark}" disabled/>
                  </div>
              </div>
              </#if>
          </div>
          <div class="xyg-bottom">
              <button type="button" class="weui-btn weui-btn_warn">
                  <#if status=='2'>
                      报名成功
                      <#else>
                          已申请，待审核
                  </#if>
              </button>
          </div>
      </#if>
  </div>
  </div>
  <div  id="showSuccess" style="display:none;">
      <div style="width:12rem; height:12rem; background: #ffffff; top: 50%; left: 50%; margin:-6rem -6rem; border-radius: 1rem; position: relative;">
          <img src="${s.base}/mobile/images/icon_tc.png" style="width: 6rem; height: 6rem; position: absolute; top: -1.5rem; left: 3rem;"/>
          <div style=" position: absolute; top:4.5rem;width: 100%;height: 2rem; text-align: center; line-height: 2rem; color: #000000; font-size: 18px; font-weight: bold; ">资料提交成功</div>
          <div style=" position: absolute; top:6rem;width: 100%;height: 2rem; text-align: center; line-height: 2rem; color: #b3b3b3; font-size: 18px;  ">结果将在1-2工作日反馈</div>
          <div onclick="window.location.href='/phone/signUpList?memberId=${memberId}'" style="width: 70%; height: 2rem; background: #ff5028; border-radius: 1rem; position: absolute; top: 9rem; left: 15%;text-align: center; line-height: 2rem; color: #ffffff; font-size: 18px;">我知道了</div>
      </div>
  </div>
  <style type="text/css">
      /*********弹窗开始***********/
      #showSuccess{position: fixed; top:0;left:0; width:100%; height:100%;background:rgba(0, 0, 0, 0.7);z-index:20000; }
      /**********弹窗结束***********/
	  html,body{background:#f5f5f5;}
  	.xyg-comp-list-select{width:100%; height:auto;}
	  .xyg-comp-list-select .xyg-comp-pic{width:90%; padding:0.5rem 5%; background: #FFF;}
	  .xyg-comp-list-select .xyg-comp-pic-title{width:100%;line-height:1.5rem; padding-bottom: 0.5rem; font-size: 0.8rem; color:#000; letter-spacing: 0.01rem; }
	  .xyg-comp-list-select .xyg-comp-pic-title-left{width: 50%; height: 6rem; float: left;}
	   .xyg-comp-list-select .xyg-comp-pic-title-left img{width: 100%; height: 6rem;}
	   .xyg-comp-list-select .xyg-comp-pic-title-right{width: 50%; height: 6rem; float: left;}
	  
	.xyg-comp-list-select-item{width:90%; padding:0px 5%; line-height:2.2rem; height:2.2rem;font-size: 0.8rem; color:#000; letter-spacing: 0.01rem; background: #FFF; border: 0.001rem solid #f5f5f5;}
	  .xyg-comp-list-select-item input::-webkit-input-placeholder {color: #999999;}
	.xyg-comp-list-select-item .xyg-comp-list-select-item-icon{width:70%; line-height:2rem; text-align:right; float:left; color: #999999;}
	.xyg-comp-list-select-item .xyg-comp-list-select-item-title{width:30%; height:2rem; text-align:left; float:left;}
	.xyg-comp-list-select-item .xyg-comp-list-select-item-content{width:70%; height:2rem; text-align:left; float:left;}
	.xyg-comp-list-select-item .xyg-comp-list-select-item-content input{width:100%; height:2rem; line-height:2rem;background-color:transparent;border:0; text-align:right;}
	.xyg-comp-xy{height:2rem; line-height:2rem; width:width:93%; margin:0px 2% 0px 5%;}
	.xyg-bottom{width:90%; height:auto;  margin:1.5rem 5%;}
  </style>
  </body>
  <script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
  <script src="${s.base}/mobile/js/jquery-2.1.4.js"></script>
  <script src="${s.base}/mobile/js/jquery-weui.js"></script>
  <script src="${s.base}/mobile/js/dateUtil.js"></script>
  <script src="${s.base}/mobile/fonts/iconfont.js"></script>
  <script src="${s.base}/mobile/lib/Mdate/iScroll.js"></script>
  <script src="${s.base}/mobile/lib/Mdate/Mdate.js"></script>
  <script type="text/javascript" src="${s.base}/mobile/js/ajaxfileupload.js"></script>
  <script type="text/javascript">
      new Mdate("brithday", {format: "-"});
      var signId='${webSignUp.id}';
      var userType='${webSignUp.userType}';
      var memberId='${memberId}';

      $("#sexSelect").select({
          title: "选择性别",
          items:${sexSelect},
          onClose: function (d) {
              $("#sex").val(d.data.values);
              $("#sexSelect span").html(d.data.titles);
          }
      });

      $("#submitBtn").on("click",function(){
          var id = $("#id").val();
          var name = $("#name").val();
          if(name == null || name == "") {
              $.toast("请输入姓名", "text");
              return false;
          }
          var brithday = $("#brithday").val();
          if(brithday == null || brithday == "") {
              $.toast("请选择出生日期", "text");
              return false;
          }

          var sex = $("#sex").val();
          if(sex == null || sex == "") {
              $.toast("请选择性别", "text");
              return false;
          }
          var nation = $("#nation").val();
          if(nation == null || nation == "") {
              $.toast("请先填写民族", "text");
              return false;
          }
          var phone = $("#phone").val();
          if(phone == null || phone == "") {
              $.toast("请输入联系电话", "text");
              return false;
          }
          var regPhone = /^((1[2|3|4|5|6|7|8|9][0-9]{9})|([0-9]{12}))$/;
          if(regPhone.test(phone) === false){
              $.toast("联系电话输入错误", "text");
              return  false;
          }

          var workAddress = $("#workAddress").val();
          if(workAddress == null || workAddress == "") {
              $.toast("请输入工作地址", "text");
              return false;
          }
          var homeAddress = $("#homeAddress").val();
          if(homeAddress == null || homeAddress == "") {
              $.toast("请输入家庭地址", "text");
              return false;
          }
          var political = $("#political").val();
          if(political == null || political == "") {
              $.toast("请输入政治面貌", "text");
              return false;
          }
          var idCard = $("#idCard").val();
          if(idCard == null || idCard == "") {
              $.toast("请输入身份证号", "text");
              return false;
          }
          var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
          if(reg.test(idCard) === false){
              $.toast("身份证输入不合法", "text");
              return  false;
          }
          var idCardPicture = $("#idCardPicture").val();
          if(idCardPicture == null || idCardPicture == "") {
              $.toast("请输入上传身份证照片", "text");
              return false;
          }
          var headImage = $("#headImage").val();
          if(headImage == null || headImage == "") {
              $.toast("请输入上传照片", "text");
              return false;
          }
          if(!$("input[type='checkbox']").prop("checked")){
              $.toast("请先阅读用户承诺书，并勾选", "text");
              return false;
          }
          var param = {id:id,signId:signId,memberId:memberId,userType:userType,name:name,brithdayStr:brithday,sex:sex,nation:nation,phone:phone,workAddress:workAddress,homeAddress:homeAddress,
              political:political,idCard:idCard,
              headImage:headImage,idCardPicture:idCardPicture};
          $.showLoading("正在提交中");
          $.post("/phone/signUpSave",param,function(result){
              if(0==result.code){
                  $.hideLoading();
                 $("#showContent").hide();
                  $("#showSuccess").show();
              }else{
                  $.hideLoading();
                  $.alert(result.msg);
              }
          },"json");
      });

  </script>
</html>

